﻿<!DOCTYPE html>
<!--[if IE 8 ]>
<html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!-->
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"><!--<![endif]-->
<head>

    <!-- Basic Page Needs
    ================================================== -->
    <meta charset="utf-8"/>
    <title>订单结算</title>

    <!-- Mobile Specific Metas
    ================================================== -->
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>

    <!-- CSS
    ================================================== -->
    <link rel="stylesheet" href="css/style.css" th:href="@{/css/style.css}"/>
    <link rel="stylesheet" href="css/colors/green.css" th:href="@{/css/colors/green.css}" id="colors"/>

    <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

</head>

<body class="boxed">
<div id="wrapper">


    <!-- Header
        ================================================== -->
    <div th:replace="fragments/header :: header"></div>


    <!-- Titlebar
    ================================================== -->
    <section class="titlebar">
        <div class="container">
            <div class="sixteen columns">
                <h2>填写订单详情</h2>

                <nav id="breadcrumbs">
                    <ul>
                        <li><a href="index.html">首页</a></li>
                        <li><a href="checkout.html">购物车</a></li>
                        <li>订单结算</li>
                    </ul>
                </nav>
            </div>
        </div>
    </section>


    <!-- Content
    ================================================== -->

    <!-- Container -->
    <div class="container">


        <!-- Checkout Cart -->
        <div class="eight columns">
            <div class="checkout-section cart">商品清单</div>
            <!-- Cart -->
            <table class="checkout cart-table responsive-table">

                <tr>
                    <th class="hide-on-mobile"></th>
                    <th></th>
                    <th></th>
                    <th></th>
                    <th></th>
                </tr>

                <!-- Item #1 -->
                <tr th:each="item,itemStat : ${cart_items}">
                    <td class="hide-on-mobile">
                        <div class="happy-clients-photo"><img src="images/dog_1.jpg" th:src="@{'/images/' + ${item.cart_item_image}}" alt=""/></div>
                    </td>
                    <td class="cart-title"><a href="#" th:text="${item.cart_item_name}"></a></td>
                    <td th:text="'¥' + ${item.cart_item_price}"></td>
                    <td class="qty-checkout" th:text="${item.cart_item_num}"></td>
                    <td class="cart-total" th:text="'¥' + ${item.cart_item_total_price}"></td>
                </tr>

            </table>

            <!-- Apply Coupon Code / Buttons -->
            <table class="cart-table bottom">

                <tr>
                    <th class="checkout-totals">
                        <div class="checkout-subtotal">
                            总价: <span></span>
                        </div>
                    </th>
                </tr>

            </table>
        </div>
        <!-- Checkout Cart / End -->

        <div class="eight columns">

            <form method="post" name="orderform" th:action="@{/creatOrder}" th:object="${order}">

                <!-- Billing Details Content -->
                <div class="checkout-section active"><span>*</span> 填写订单详情</div>
                <div class="checkout-content">
                    <div class="half first"><label>收货人: <abbr>*</abbr></label><input type="text" placeholder="" th:field="*{receiver_name}" value=""/>
                    </div>
                    <div class="half"><label>电话号码: <abbr>*</abbr></label><input type="text" placeholder="" value="" th:field="*{receiver_phone}" />
                    </div>
                    <label>详细地址: <abbr>*</abbr></label><input type="text" class="input-text " value="" th:field="*{receiver_address}" />
                </div>
                <div class="clearfix"></div>
                <a href="javascript:document.orderform.submit();" class="continue button color">去结算</a>

            </form>

        </div>
        <!-- Billing Details / Enc -->


    </div>
    <!-- Container / End -->

    <div class="margin-top-50"></div>


    <!-- Footer
            ================================================== -->
    <div th:replace="fragments/footer :: footer"></div>

</div>


<!-- Java Script
================================================== -->
<div th:replace="fragments/scripts :: scripts"></div>


<!-- Style Switcher
================================================== -->
<div th:replace="fragments/styleswitcher :: styleswitcher"></div>


</body>
</html>
